<!--订单详情-->
<template>
	<div class="order-detail">
		<h4>{{$t('order.title1')}}</h4>
		<order-item :order="order.orderInfo"></order-item>
		<h4>{{$t('order.title2')}}</h4>
		<coupon-item :coupon="order.couponInfo"></coupon-item>
	</div>
</template>

<script>
import orderItem from './component/orderItem.vue';
import couponItem from '../coupon/component/couponItem.vue';
import { getOrderDetail } from '@/api/c'

export default {
  name: 'orderDetail',
  components: { orderItem, couponItem },
  data() {
    return {
    	id: this.$route.params.id,
    	order: {},
		activeName: 'active' //券分类列表，当前哪个分类
    }
  },
	methods: {
		getOrder() {
		  	getOrderDetail({orderId: this.id + ""}).then(response => {
	            this.order = response.data
	            // if (!this.order.clientCouponId) {
	            // 	this.$message.error('you have not choose one coupon!');
	            // 	setTimeout(() => {
	            // 		this.$router.push('list')
	            // 	}, 500)
	            // }
	        })
	  }
	},
	created() {
	  this.getOrder()
	}
}
</script>

<style  scoped>
p {
	margin: 0;
}
li {
	list-style: none;
}
.app-main {
	padding: 100px 0;
}
.order-detail {
	color: #333333;
	width: 898px;
	border: 1px solid #EBEDF8;
	background: #ffffff;
	margin: 0 auto;
	padding: 32px 36px;
}
	.order-detail h4 {
	  	font-size: 16px;
		margin-bottom: 37px;
	}
	.order-item {
		margin-bottom: 88px;
	}
	.coupon-item {
		width: 368px;
	}
</style>
<style type="text/css">
</style>
